<!--
<template>
<div class="moreThan">
  <div class="publishComment">
    <div class="goodsArea" v-for="(v,i) in commentGood" :key="i">
      <div class="imgBox">
        <img :src="v.img" alt="">
      </div>
      <div class="right">
          <p class="price">￥{{v.real_price}}</p>
          <p class="goodsNum">×{{v.goods_nums}}</p>
      </div>
      <div class="left">
        <p class="goodsname">{{v.goods_name}}</p>
        <p class="specArrey">尺码：{{v.spec_array}}</p>
        <button>七天退换</button>
      </div>
    </div>
    <div class="comment">
      <div><input id="nice" type="radio" checked name="comment"><label for="nice">好评</label></div>
      <div><input id="middle" type="radio" name="comment"><label for="middle">中评</label></div>
      <div><input id="bad" type="radio" name="comment"><label for="bad">差评</label></div>
    </div>
  </div>
  <div class="commentContent">
    <div class="content">
      <p class="contenText">评价内容</p>
      <textarea name="" id="" @blur="checkContent" v-model="textarea" cols="30" rows="5" placeholder="最少十个字" style=" min-height:10vw"></textarea>
    </div>
  </div>
  <div class="pushImg">
    <input @change="fileChange($event)" type="file" id="upload_file" multiple style="display: none"/>
    <div class="add" @click="chooseType"> <div class="add-image" align="center"> <i class="icon-camera"></i> //按钮中的图片是一个icon字体图标 <p class="font13">添加图片</p> </div> </div>
    <!-- <div class="add-img" v-show="imgList.length"> <p class="font14">图片(最多6张，还可上传<span v-text="6-imgList.length"></span>张)</p> <ul class="img-list"> <li v-for="(url,index) in imgList"> <img class=         "del" src="../../assets/img/home/btn_clean.png" @click.stop="delImg(index)"/> <yd-lightbox> <div class="app-bg"> <yd-lightbox-img class="app-bg" :original="url.file.src" v-lazy:background-image="{src: url.file.src, error: require('../../assets/img/common/img_placeholder400.png'), loading: require('../../assets/img/common/img_placeholder400.png')}"></yd-lightbox-img> </div> </yd-lightbox> </li> </ul> </div> -->

  </div>
</div>
</template>

<script>
    export default {
        name: "publishComment",
      data(){
          return{
            listgoods:[],
            commentGood:[],
            showFace: false,
            imgList: [],
            size: 0,
            limit:6, //限制图片上传的数量
            tempImgs:[]
          }
      },
      methods:{
        checkContent(){
          if (this.textarea.length<10) {
            this.$toast("输入字符最少不能少于十个哦")
          }
        },
        chooseType() {
          document.getElementById('upload_file').click();
        },
        fileChange(el) {
          if (!el.target.files[0].size)
            return; t
          his.fileList(el.target);
            el.target.value = ''
        },
        fileList(fileList) {
          let files = fileList.files;
          for (let i = 0; i < files.length; i++) {
            if (files[i].type != '') {
              this.fileAdd(files[i]);
            } else {
              this.folders(fileList.items[i]);
            }
            }
        },
      },
      mounted(){
          document.title = "发表评价";

      },
      created(){
        this.listgoods = window.localStorage.getItem('listGoods');
        this.commentGood = eval('(' + this.listgoods + ')');
      }
    }
</script>

<style scoped lang="scss">
  .pushImg{
    width: 92vw;
    height: auto;
    margin: 0 auto;
    padding-top: 4vw;
      .addImg{
        width: 26.67vw;
        height: 26.67vw;
        border:2px solid rgba(206,206,206,1);
      }
      p{
        font-size: 18px;
        color: #333;
          span{
            font-size: 11px;
            color: #666;
          }
      }
  }
  .commentContent{
    width: 100vw;
    height: 50vw;
    border-bottom: 4vw solid #F5F5F5;
    border-top:  4vw solid #F5F5F5;
    .content{
      width: 92vw;
      height: 100%;
      margin: 0px auto;
      padding-top: 4vw;
      padding-bottom: 3vw;
      textarea::placeholder{
        font-size: 15px;
        color: #999;
        text-align: center;
        line-height: 25vw;
      }
      textarea{
        width: 100%;
        background: #f5f5f5;
        border: none;
        font-size: 15px;
        color: #333;
        height: 27vw;
      }
      .contenText{
        font-size: 18px;
        color: #333;
      }
    }
  }
  .moreThan{
    width: 100vw;
    height: 100vh;
  }
.publishComment{
  width:92vw;
  height: 50vw;
  margin: 0px auto;
  .comment{
    width: 75vw;
    height: auto;
    margin: 0 auto;
    display: flex;
    div{
      flex: 1;
      display: inline-block;
      input{
        display: none;
      }
        label{
          width: 16vw;
          height: 16vw;
          border-radius: 16vw;
          background: #f5f5f5;
          display: inline-block;
          color: #333;
          font-size: 15px;
          line-height: 16vw;
          text-align: center;
        }
      input[type="radio"]:checked+label {
        background-color: #ff4c50;
        color: #fff !important;
      }
    }
  }
  .goodsArea{
    width: 100%;
    height:26vw;
    padding-top: 4vw;
    .right{
      float: right;
      .price{
        color: #333;
        font-size: 12px;
      }
      .goodsNum{
        font-size: 12px;
        color: #999;
        float: right;
      }
    }
    .imgBox{
      float: left;
      width: 20vw;
      height: 20vw;
      margin-right: 2.3vw;
    }
    .specArrey{
      font-size: 11px;
      color: #999;

    }
    button{
      color: #FF5230;
      border: 1px solid #FF5230;
      background: none;
      width: 14.3vw;
      line-height: 4.5vw;
      height: 5vw;
      border-radius: .5vw;
      margin-top: 2vw;
      font-size: 11px;
    }
    .goodsname{
      color: #666;
      font-size: 12px;
    }
    .left{
      float: left;
    }
  }
}
</style>
-->
